Template Usage

Getting the data out of Archetype is easy. Consider the following:

  1. @inherits Umbraco.Web.Mvc.UmbracoTemplatePage
  2. @using Archetype.Models;
  3. @using Archetype.Extensions;
  4. @{
  5. Layout = null;
  6. }
  7. //use case #1 - Covers a single Archetype
  8. @foreach (var fieldset in Model.Content.GetPropertyValue<ArchetypeModel>("a1"))
  9. {
  10. <!-- get a property by name -->
  11. <div>@fieldset.GetValue("mntp")</div>
  12. <!-- or -->
  13. <!-- if using a property editor with a value converter -->
  14. <div>@fieldset.GetValue<IEnumerable<IPublishedContent>>("mntp")</div>
  15. }
  16. //use case #2 - Covers nested Archetypes
  17. @foreach (var fieldset in Model.Content.GetPropertyValue<ArchetypeModel>("a1"))
  18. {
  19. <div>@fieldset.GetValue("firstName")</div>
  20. <!-- get nested Archetype -->
  21. foreach(var nestedFs in fieldset.GetValue<ArchetypeModel>("movieList")){
  22. <h3>@nestedFs.GetValue("title")</h3>
  23. <div>@nestedFs.GetValue("text")</div>
  24. }
  25. }
  26. //use case #3; be able to iterate over the properties, however this will not pass value through converters
  27. @foreach (var fieldset in Model.Content.GetPropertyValue<ArchetypeModel>("a1"))
  28. {
  29. <!-- will not go through value converters -->
  30. foreach (var prop in fieldset.Properties)
  31. {
  32. <div>@prop.Value</div>
  33. }
  34. }

Page Builder

You can even render partials based on the alias of the fieldset easily. If you have an Archetype that has more than one fieldset configured with aliases of RichtextModule and GalleryModule, then you can render them dynamically with one line of code:

@Html.RenderArchetypePartials(Model.Content.GetPropertyValue<ArchetypeModel>("modules"))

This example assumes you named your property modules on your document type.

Each partial would have to be defined in the ~/Views/Partials/Archetype folder like so:

  1. @* File ~/Views/Partials/Archetype/RichtextModule.cshtml *@
  2. @inherits Umbraco.Web.Mvc.UmbracoViewPage<ArchetypeFieldsetModel>
  3. @using Archetype.Models;
  4. <div class="row">
  5. <div class="content col-lg-12">
  6. @Html.Raw(Model.GetValue("text"))
  7. </div>
  8. </div>
  1. @* File ~/Views/Partials/Archetype/GalleryModule.cshtml *@
  2. @inherits Umbraco.Web.Mvc.UmbracoViewPage<ArchetypeFieldsetModel>
  3. @using Archetype.Models;
  4. <div class="row">
  5. <div class="content col-lg-12">
  6. <!-- do something here for a gallery -->
  7. </div>
  8. </div>

The next snippet is the final template:

  1. @using Archetype.Extensions
  2. @using Archetype.Models
  3. @using MyNamespace.UmbracoExtensions.BizMag.Models
  4. @inherits Umbraco.Web.Mvc.UmbracoTemplatePage
  5. @{
  6. Layout = "~/Views/BizMag/BizmagBase.cshtml";
  7. }
  8. <!-- begin:container -->
  9. <div class="container content-wrapper article">
  10. <!-- begin:main-section -->
  11. <div class="row">
  12. <div class="col-md-12">
  13. @Html.Partial("~/Views/BizMag/Partials/Breadcrumbs.cshtml")
  14. </div>
  15. </div>
  16. <div class="row">
  17. <div class="col-md-12">
  18. <h1>@Model.Content.Name</h1>
  19. </div>
  20. </div>
  21. <div class="row">
  22. <!-- begin:article -->
  23. <div class="col-md-8">
  24. @* this will read the entire archetype and render a partial named the same as the fieldset alias *@
  25. @Html.RenderArchetypePartials(Model.Content.GetPropertyValue<ArchetypeModel>("modules"))
  26. @Html.Partial("~/Views/BizMag/Partials/ContactForm.cshtml", new ContactUsModel())
  27. </div>
  28. <!-- end:article-->
  29. <!-- begin:sidebar -->
  30. <div class="col-md-4">
  31. <!-- begin:widget-sidebar -->
  32. <div class="content-article">
  33. @Html.Partial("~/Views/BizMag/Partials/Archives.cshtml")
  34. </div>
  35. <!-- end:widget-sidebar -->
  36. </div>
  37. <!-- end:sidebar -->
  38. </div>
  39. <!-- end main-section-->
  40. </div>